<p-panel [collapsed]="false" header="筛选查询" [collapsed]="false" headerClass="bg-eaeaea border-none" headerClass="bg-eaeaea border-none"
    [(searchText)]="searchObj.searchValue" maxlength="20" search="名称" (onSearch)="search();dt.reset();">
    <!-- <p-header>
            <span class="border-l-1a8fe8 p-l-8">搜索条件 </span>
        </p-header> -->
    <div class="p-2-8">
        <div class="inline-block">
            <span class="p-r-10 opacity06">状态： </span>
            <p-dropdown placeholder="全部" styleClass="width-150 m-r-30" [options]="isEffect" [(ngModel)]="selectedIsEffect" [ngModelOptions]="{standalone: true}"
                optionLabel="name" (onChange)='search();dt.reset();'></p-dropdown>
        </div>

        <!-- <div class="inline-block width-250 pull-right">
                <div class="relative">
                    <input type="text" class="width-full p-input" pInputText [(ngModel)]="searchObj.searchValue" placeholder="名称" (keyUp.enter)="search()">
                    <span class="icon-search-right" (click)="search()"></span>
                </div>
            </div> -->
    </div>
</p-panel>


<p-dataTable #dt [value]="listData"  [marginHeight]="20" [totalRecords]="totalRecords"   [loading]="loading"
    [lazy]="true" (onLazyLoad)="onPage($event)"  [paginator]="true" [pageLinks]="4" [(selection)]="selectedRowData"
    [headerCheckboxToggleAllPages]="true" [emptyMessage]="'没有搜到您想要的数据'">
    <p-header>
        <button pButton type="button" (click)="addTemplate()" label="新建" class="btn btn-secondary"></button>
        <button pButton type="button" (click)="updateStatus('start')" label="启用" class="btn btn-secondary"></button>
        <button pButton type="button" (click)="updateStatus('')" label="禁用" class="btn btn-secondary"></button>
    </p-header>
    <p-column [style]="{'width':'46px'}" selectionMode="multiple"></p-column>
    <p-column *ngFor="let col of colsSelected" [field]='col.field' [header]='col.header' [hidden]="col.hidden" [sortable]="col.sortable">
        <ng-template let-index="rowIndex" let-data="rowData" pTemplate="body" *ngIf="col.tem">
            <div *ngIf="col.field === 'name'" >
                <a class="color-1a91eb" [title]="data[col.field]"  target="_blank" [routerLink]="['/saas/engineer/constructionconfig/template/edit', data.id]"> {{data.name}} </a>
            </div>
            <div *ngIf="col.field === 'isEffect'">
                {{data.isEffect?'启用':'禁用'}}
            </div>
            <div *ngIf="col.field === 'useAbleAreaFrom'">
                {{data.useAbleAreaFrom}}&nbsp;~&nbsp;{{data.useAbleAreaTo}}
            </div>
            <div *ngIf="col.field === 'constructionLimit'">
                {{data.constructionLimitDaysFrom}}&nbsp;~&nbsp;{{data.constructionLimitDaysTo}}
            </div>
        </ng-template>
    </p-column>
</p-dataTable>
